<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>文件的上传</title>
  <!--引入jQuery-->
  <script type="text/javascript" src="js/jquery-3.6.0.min.js"></script>
  <script type="text/javascript">
     $(function () {
           $("#btn_submit").click(function () {
                var formData = new FormData($("#myform")[0]);
                formData.append("username","gxa");
                formData.append("password","123");
//                formData.append($("#myform")[1]);
//                formData.append($("#myform")[2]); //将添加文件存入formData对象中
                $.ajax({
                    url:"/ajax_upload",
                    type:"post",
                    data:formData,
                    cache:false,//设置为 false 将不缓存此页面。
                    processData:false,//如果要发送 DOM 树信息或其它不希望转换的信息，请设置为 false。
                    contentType:false,//
                    dataType:"json",
                    success:function (res) {
                         alert(res.msg);
                    }
                })
           });
     })
  </script>
</head>
<body>
      <p>
        用户名称：<input type="text" name="username" />
      </p>
      <p>
        用户密码：<input type="password" name="password" />
      </p>
      <form id="myform" enctype="multipart/form-data">

           <p>
             用户头像：<input type="file" name="user_pic" />
           </p>
      </form>
      <p>
        <input id="btn_submit" type="button" value="提交">
      </p>


</body>
</html>